{% include account_nav %}
<div class="container_wrapper account_changepassword_default" id="account_changepassword">
        <h1 class="title">{{lang.account.default.change_password | upcase }}</h1>
        <div class="mo-form" id="password-form">
            {% comment %} <div class="mo-form-item" name="old_password">
                <div class="mo-form-item-value">
                    <input class="mo-form-input" placeholder="{{lang.account.form.current_password}}" type="password" />
                </div>
            </div> {% endcomment %}
            <div class="mo-form-item" name="new_password">
                <div class="mo-form-item-value">
                    <input class="mo-form-input" placeholder="{{lang.account.form.new_password}}" type="password" />
                </div>
            </div>
            <div class="mo-form-item" name="new_passwords">
                <div class="mo-form-item-value">
                    <input class="mo-form-input" placeholder="{{lang.account.form.confirm_new_password}}" type="password" />
                </div>
            </div>

            <div class="mo-form-item">
                <div class="mo-form-item-value">
                    <div class="main_btn form_btn" id='confirm'>{{lang.account.change_password.btn_text}}</div>
                </div>
            </div>
        </div>

    <div class="back-box">
        <a href="/account">
            <!-- {% include icon_account_back ,width:'32',height:'28' %} -->
            <svg t="1642570712144" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="24369" width="24" height="24"><path d="M85.333333 512.042667l320-256v213.333333H1024v85.333333H405.333333v213.333334z" p-id="24370"></path></svg>
            <span>{{ lang.account.default.account }}</span>
        </a>
    </div>
</div>


<script type="text/javascript">
    (function () {
        const rules = {
            old_password: [{ required: true, message: "{{lang.account.ruls.current_password}}" }],
            new_password: [{ required: true, message: "{{lang.account.ruls.new_password}}" },{
                validator:function(value, rules,callback){
                    if(value.length>15 || value.length<6){
                        return callback("{{lang.account.ruls.password_invalid}}");
                    }
                }
            }],
            new_passwords: [{ required: true, message: "{{lang.account.ruls.confirm_new_password}}" },{
                validator:function(value, rules,callback){
                    const params = moi.paramsValueString(form.allValue());
                    if(value !== params.new_password){
                        return callback("{{lang.account.ruls.two_password_invalid}}");
                    }
                }
            }],
        };

        const form = moi.form("#password-form", rules);
        $("#confirm").click(function () {
            if (form.allVerify()) {
                //显示加载
                const load = moi.nodeShowLoading(this);
                const params = moi.paramsValueString(form.allValue());
                moi.ajax({
                    url: '/account/changepassword',
                    type: 'put',
                    data: JSON.stringify(params),
                    complete: function () {
                        load.close();
                    },
                    success: function (data) {
                        //错误提示
                        if (!data.code) {
                            
                            moi.message({ content: '{{ lang.customers.login.modify_successfully | capitalize }}',onClose(){
                                 moi.href("{{routes.account_url}}");
                            }});
                        } else {
                            return moi.alert({ title: data.msg });
                        }
                    }
                })
            }
        });
    })();
</script>